<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>网站后台管理模版</title>
    <link rel="stylesheet" type="text/css" th:href="@{/layui/css/layui.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/admin.css}"/>
</head>
<body>
<form class="layui-form column-content-detail">
    <div class="layui-tab">
        <ul class="layui-tab-title">
            <li class="layui-this">重新提交</li>
            <li>审批过程</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                    <form class="layui-form">
                        <input id="taskId" name="taskId" th:value="${taskId}" type="hidden"/>
                        <div class="layui-form-item">
                            <label class="layui-form-label">类型：</label>
                            <div class="layui-input-block">
                                <select name="leaveType" lay-filter="leaveType" id="type" required lay-verify="required"  >
                                    <option value="" disabled selected>请选择一个类型</option>
                                    <option value="0" th:selected="${leaveBill.leaveType == '0'}">事假</option>
                                    <option value="1" th:selected="${leaveBill.leaveType == '1'}">病假</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">请假时间：</label>
                            <div class="layui-input-block">
                                <input type="text" class="layui-input" id="applyTimeStr"  name="applyTimeStr" th:value="${leaveBill.startTimeStr +' - '+leaveBill.endTimeStr}" readonly required lay-verify="required" placeholder="请选择请假时间范围">
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">请假天数：</label>
                            <div class="layui-input-block">
                                <input type="number" min="1" id="days" name="days" required lay-verify="required" th:value="${leaveBill.days}" placeholder="请输入请假天数" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">请假原因：</label>
                            <div class="layui-input-block">
                                <input type="text" id="leaveReason" name="leaveReason" th:value="${leaveBill.leaveReason}" required lay-verify="required" placeholder="请输入请假原因" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">是否继续申请 ：</label>
                            <div class="layui-input-block">
                                <select name="reapply" lay-filter="reapply" id="reapply" required lay-verify="required"  >
                                    <option value="" disabled selected>请选择</option>
                                    <option value="true">重新申请</option>
                                    <option value="false">不再申请</option>
                                </select>
                            </div>
                        </div>

                        <div class="layui-form-item" style="padding-left: 10px;">
                            <div class="layui-input-block">
                                <button class="layui-btn layui-btn-normal" type="button" lay-submit lay-filter="formDemo">立即提交</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </form>

            </div>

            <div class="layui-tab-item">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th>审批步骤</th>
                        <th>审批人</th>
                        <th>审批意见</th>
                        <th>审批时间</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="step,gwstate:${stepList}">
                        <td th:text="${step.stepName}"></td>
                        <td th:text="${step.stepUser}"></td>
                        <td th:text="${step.stepSuggest}"></td>
                        <td th:text="${#dates.format(step.createTime,'yyyy-MM-dd HH:mm:ss')}"></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

</form>
<script th:src="@{/layui/layui.js}" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/common.js}" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/jquery-3.2.1.min.js}" type="text/javascript" charset="utf-8"></script>
<script>
    layui.use(['form', 'table','jquery', 'laydate', 'layer', 'laypage', 'dialog',  'tool', 'element', 'upload', 'layedit'], function() {
        var form = layui.form,
            layer = layui.layer,
            table = layui.table,
            $ = layui.jquery,
            laypage = layui.laypage,
            laydate = layui.laydate,
            layedit = layui.layedit,
            tool = layui.tool,
            element = layui.element,
            dialog = layui.dialog;

        //获取当前iframe的name值
        var iframeObj = $(window.frameElement).attr('name');

        laydate.render({
            elem: '#applyTimeStr',
            range: true,
            trigger: 'click'
            , done: function(value, date) {
                var data = value.split(' - ');
                var days = getDaysBetween(data[0], data[1]);
                $('#days').val(days);
            }
        });



        form.verify({
            required:function (value,item) {
                var msg="必填项不能为空";
                value= $.trim(value);
                var isEmpty=!value || value.length<1;
                // 当前验证元素是select且为空时,将页面定位至layui渲染的select处，或自定义想定位的位置
                if(item.tagName=='SELECT' && isEmpty){
                    $("html").animate({
                        scrollTop:$(item).siblings(".layui-form-select").offset().top-74
                    },50);
                }
                if(isEmpty){
                    return msg;
                }
            }
        });


        // 监听提交
        form.on('submit(formDemo)', function(data){
            console.log(data.field);
            $.ajax({
                url:'/person/editMyLeaveBillApplyAgain',
                data:data.field,
                type: 'post',
                dataType:'json',
                success:function (data){
                    if(data.code === 200){
                        layer.msg('请假流程已重新提交');
                    }else if(data.code === 400){
                        layer.msg(data.msg);
                    }else{
                        layer.msg('请假失败，请联系管理员');
                    }
                    var index = parent.layer.getFrameIndex(window.name);
                    setTimeout(function () {
                        //先得到当前iframe层的索引
                        parent.layer.close(index);
                        parent.layui.table.reload('test2',{page:{curr:1}});
                    },3000)

                }
            });
            return false;
        });

    });

</script>
</body>
</html>